<!DOCTYPE HTML>
<html>
<head>
	
	<title>www.cssmoban.com</title>
	
	<link rel="stylesheet" href="./css/reset.css" type="text/css" />
	<link rel="stylesheet" href="./css/style.css" type="text/css" />
	<link href='http://fonts.googleapis.com/css?family=Play:400,700' rel='stylesheet' type='text/css' />
	
	<!--[if IE]>
	<script src="./js/html5.js" type="text/javascript"></script>
	<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
	<![endif]-->
	
	<script src="./js/jquery.js"></script>
	<script src="./js/selectivizr.js"></script>
	<script src="./js/prettyphoto.js"></script>
	<script src="./js/onload.js"></script>

    
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head>
<body class="home">

<div id="page">

	<!-- BEGIN TITLEBAR -->
	<header id="titlebar">

		<a href="http://www.cssmoban.com/" id="logo"></a>

		<ul id="top_menu">
			<li class="current-menu-item">
				<a href="./index.html">Home</a>
			</li>
			<li>
				<a href="./about.htm.html">About Us</a>
			</li>
			<li>
				<a href="./blog.htm.html">Blog</a>
			</li>
			<li>
				<a href="#">Shortcodes</a>
				<ul>
					<li>
						<a href="./columns.htm.html">Columns</a>
					</li>
					<li>
						<a href="./elements.htm.html">Elements</a>
					</li>
					<li>
						<a href="./typography.htm.html">Typography</a>
					</li>
				</ul>
			</li>
			<li>
				<a href="./portfolio.htm.html">Portfolio</a>
                <ul>
					<li>
						<a href="./portfolio.htm.html">Portfolio Image</a>
					</li>
					<li>
						<a href="./portfolio-video.htm.html">Portfolio Video</a>
					</li>
					<li>
						<a href="./portfolio-other.htm.html">Portfolio Other</a>
					</li>
				</ul>
			</li>
			<li>
				<a href="./contact.htm.html">Contact</a>
			</li>
		</ul>

		<ul id="top">
			<li>Want more?</li>
			<li>
				<a href="#" class="cloud facebook">
					<span class="arrow"></span>
				</a>
			</li>
			<li>
				<a href="#" class="cloud rss">
					<span class="arrow"></span>
				</a>
			</li>
		</ul>

	</header>
	<!-- END TITLEBAR -->
	<div class="copyrights">Collect from <a href="http://www.cssmoban.com/" >网页模板</a></div>

	<!-- BEGIN SLIDER -->
	<div id="slider">
		<ul class="slider_photos">
			<li>
				<div class="inside">
					<div class="description page_text">
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. <a href="#">Leo in faucibus orci</a> luctus leo nec felis facilisis libero. Sed non eros. Vivamus iaculis, purus est!</p>
					</div>
					<img src="./img/examples/top_1.jpg" alt="" />
				</div>
			</li>
			<li>
				<div class="inside">
					<div class="description page_text">
						<p>Mauris sit amet dolor velit, at condimentum ante. Donec at justo lorem, id feugiat dui. <a href="#">Quisque tincidunt</a> pulvinar sodales. Nullam luctus arcu quis mi pulvinar interdum. Aenean accumsan orci vel diam sagittis interdum.</p>
					</div>
					<img src="./img/examples/top_2.jpg" alt="" />
				</div>
			</li>
		</ul>
		<nav class="arrows">
			<a class="next"></a>
			<a class="prev"></a>
		</nav>
		<div class="progressbar">
			<div class="bar"></div>
		</div>
	</div>
	<!-- END SLIDER -->


	<div class="cite_box">
		<p>Egestas quam in augue ut vehicula libero. <strong>Pellentesque nunc volutpat urna.</strong></p>
		<p>Nam aliquet in, iaculis ante, tincidunt quis, varius quis, lacinia quis, odio.</p>
	</div>


	<!-- BEGIN LATEST POSTS -->
	<section class="home_latest_posts page_text columns">

		<h1><strong>Lastest</strong> posts from our blog</h1>

		<!-- BEGIN 1 COLUMN -->
		<div class="column column_25">

			<p class="date">Add: Jan 03 2012</p>

			<header>
				<span class="cloud text">
					<span class="arrow"></span>
				</span>
				<strong>Etiam at consectetuer ut, laoreet purus est…</strong>
			</header>

			<a href="#" class="photo">
				<span class="more">more</span>
				<img src="./img/examples/blog_latest_small_1.jpg" alt="" />
			</a>

			<p>In accumsan et, bibendum varius ac, vulputate fringilla. In hac habitasse platea dictumst.</p>

			<p class="more"><a href="#">Read more…</a></p>

		</div>
		<!-- END 1 COLUMN -->
		
		
		<!-- BEGIN 2 COLUMN -->
		<div class="column column_25">

			<p class="date">Add: Jan 03 2012</p>

			<header>
				<span class="cloud text">
					<span class="arrow"></span>
				</span>
				<strong>Gravida. In quam at ipsum dolor cursus ante.</strong>
			</header>

			<p>Donec eros. Curabitur quis leo. Suspendisse sapien. Maecenas eu mauris. Pellentesque mattis magna. Cum sociis natoque penatibus et malesuada fames ac pede. Vestibulum egestas risus at est pretium convallis. Fusce nisl risus, euismod pede, molestie lorem hendrerit eget, aliquet eget, facilisis metus...</p>

			<p class="more"><a href="#">Read more…</a></p>

		</div>
		<!-- END 2 COLUMN -->


		<!-- BEGIN 3 COLUMN -->
		<div class="column column_25">

			<p class="date">Add: Jan 03 2012</p>

			<header>
				<span class="cloud video">
					<span class="arrow"></span>
				</span>
				<strong>Pellentesque sagittis!</strong>
			</header>

			<a href="./portfolio-projekt.htm.html" class="video">
				<span class="d"></span>
				<img src="./img/examples/blog_latest_small_2.jpg" alt="" />
			</a>

			<p>Nunc accumsan adipiscing, risus pede, posuere consectetuer. Etiam accumsan odio et magnis dis parturient montes, nascetur ridiculus mus. Mauris mattis eget, tortor</p>

			<p class="more"><a href="#">Read more…</a></p>

		</div>
		<!-- END 3 COLUMN -->


		<!-- BEGIN 4 COLUMN -->
		<div class="column column_25">

			<p class="date">Add: Jan 03 2012</p>

			<header>
				<span class="cloud text">
					<span></span>
				</span>
				<strong>Sed adipiscing non, ligula. Nam eget tortor. Nam nec libero a mauris. </strong>
			</header>
			
			<a href="#" class="photo">
				<span>more</span>
				<img src="./img/examples/blog_latest_small_3.jpg" alt="" />
			</a>

			<p>Maecenas quis faucibus a, sodales nibh ac purus.</p>

			<p class="more"><a href="#">Read more…</a></p>

		</div>
		<!-- END 4 COLUMN -->
	
	</section>
	<!-- END LATEST POSTS -->


	<!-- START INFORMATIONS -->
	<section class="home_info page_text columns">
	
		<a href="#" class="column column_33">
			<h1>Who <strong>We</strong> are?</h1>
			<span class="arrow"></span>
			<header></header>
			<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Odio, a quam at justo. Aenean commodo wisi. Sed diam felis, feugiat tempus.</p>
		</a>
		
		<a href="#" class="column column_33">
			<h1><strong>Our skills</strong> and <strong>abilities</strong></h1>
			<span class="arrow"></span>
			<header></header>
			<p>Nunc sit amet, consectetuer adipiscing elit. Curabitur gravida massa quis leo. <em class="blue"><u>Suspendisse at metus,</u></em>. Nameu. Metus, ullamcorper ut...</p>
		</a>
		
		<a href="#" class="column column_333">
			<h1>What about <strong>photo</strong> and <strong>video</strong>?</h1>
			<span class="arrow"></span>
			<header></header>
			<p>Etiam dictum arcu. Etiam blandit eros, sit amet, neque. Praesent eu condimentum quam. Donec ornare velit sed turpis.</p>
		</a>

	</section>
	<!-- END INFORMATIONS -->


	<!-- START HOME PORTFOLIO -->
	<section class="home_portfolio page_text columns">

		<nav class="arrows">
			<a class="next"></a>
			<a class="prev"></a>
		</nav>

		<h1><strong>Some works</strong> from <strong>Our</strong> portfolio</h1>

		<div id="slider_portfolio">
			<ul>
				<li class="column">
					<a href="./portfolio-projekt.htm.html">
						<span></span>
						<img src="./img/examples/portfolio_small_1.jpg" alt="" />
					</a>
				</li>
				<li class="column">
					<a href="./portfolio-projekt.htm.html">
						<span></span>
						<img src="./img/examples/portfolio_small_2.jpg" alt="" />
					</a>
				</li>
				
				<li class="column">
					<a href="./portfolio-projekt.htm.html">
						<span></span>
						<img src="./img/examples/portfolio_small_3.jpg" alt="" />
					</a>
				</li>
				<li class="column">
					<a href="./portfolio-projekt.htm.html">
						<span></span>
						<img src="./img/examples/portfolio_small_4.jpg" alt="" />
					</a>
				</li>
				<li class="column">
					<a href="./portfolio-projekt.htm.html">
						<span></span>
						<img src="./img/examples/portfolio_small_5.jpg" alt="" />
					</a>
				</li>
			</ul>
		</div>

	</section>
	<!-- END HOME PORTFOLIO -->

</div>
<!--  END PAGE -->


<!--  START FOOTER -->
<footer id="footer">
	
	<section class="contact">
		
		<span class="mobile">
			<strong>Mobile Phone:</strong> 555 152 535
		</span>

		<span class="mail">
			<strong>E-mail:</strong> <a href="mailto:contact@experience.com">contact@experience.com</a>
		</span>
		
		<a class="top">top</a>

	</section>

	<nav>
		<ul id="footer_menu">
			<li class="current-menu-item"><a href="./index.html">Home</a></li>
			<li><a href="./about.htm.html">About Us</a></li>
			<li><a href="./blog.htm.html">Blog</a></li>
			<li><a href="./typography.htm.html">Shortcodes</a></li>
			<li><a href="./portfolio.htm.html">Portfolio</a></li>
			<li><a href="./contact.htm.html">Contact</a></li>
		</ul>
	</nav>
	
	<p class="copyright">
		&copy; Copyright &copy; 2013.Company name All rights reserved.<a target="_blank" href="http://www.cssmoban.com/" title="模板之家">模板之家</a> Collect from <a href="http://www.cssmoban.com/" title="网站模板" target="_blank">网站模板</a>
	</p>

</footer>
<!--  END FOOTER -->



</body>
</html>